<!DOCTYPE html>
<html lang="zh">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>18.6 v-model 指令</title>

	<style>
		input[type="text"] {
			height: 30px;
			width: 300px;
			margin-bottom: 10px;
			border-radius: 5px;
			padding: 2px;
			font-size: 16px;

		}

		button {
			width: 100px;
			height: 40px;
		}

		input {
			height: 36px;

		}

		pre {
			background-color: beige;
			display: inline-block;
		}

		select {
			width: 200px;
			height: 200px;
		}
	</style>

</head>

<body>


	<div id="app">


		<!-- <div>
			<label>男
				<input type="radio" v-model="sex" value="male">
			</label>
			<label>女
				<input type="radio" v-model="sex" value="female">
			</label>
		</div> -->




		<!-- 
		<div>
			<label>男
				<input type="checkbox" v-model="sex" value="male">
			</label>
			<label>女
				<input type="checkbox" v-model="sex" value="female">
			</label>
			<label>未知
				<input type="checkbox" v-model="sex" value="unkown">
			</label>
		</div>
		{{sex}} -->


		<!-- <div>
			<textarea v-model="article" id="" cols="30" rows="10"></textarea>
		</div> -->

		<!-- 
		<div>
			你来自哪里？<br>
			<select v-model="from" id="">
				<option value="1">北京</option>
				<option value="2">上海</option>
				<option value="3">南京</option>
				<option value="4">苏州</option>
				<option value="5">天津</option>

			</select>
			{{from}}
		</div> -->




		<div>
			你要去哪里？<br>

			<select v-model="destination" multiple>
				<option value="1">北京</option>
				<option value="2">上海</option>
				<option value="3">南京</option>
				<option value="4">苏州</option>
				<option value="5">天津</option>
			</select>
			{{destination}}

		</div>

	</div>


	<script src="../lib/vue.js"></script>
	<script src="js/main.js"></script>

</body>

</html>